<?php echo $this->headLink()->appendStylesheet('/css/redmond/jquery-ui-1.8.5.custom.css') ?>
<script type="text/javascript" src="/jquery/jquery-ui-1.8.5.custom.min.js"></script> 
<script type="text/javascript" src="/jquery/jquery.ui.core.js"></script> 
<script type="text/javascript" src="/jquery/jquery.ui.datepicker.js"></script> 
<script type="text/javascript" src="/jquery/jquery.validate.js"></script> 
<script type="text/javascript">
$(document).ready(function(){
	$.validator.addMethod(
	    "dateFormat",
	    function(value, element) {
	        var bool = false;
	        if(value.match(/^\d\d\d\d?-\d\d?-\d\d$/) || value == ''){
				bool = true;
		    }
	        return bool;
	    },
	    "請輸入日期格式 (YYYY-MM-DD)"
	);
	
	$("#editUserInfoForm").validate({
		highlight: function(element, errorClass) {
	    	$(element).css({ backgroundColor: "rgb(240,150,150)"});
	    },
	    unhighlight: function(element, errorClass) {
	        $(element).css({ backgroundColor: "rgb(160,255,165)"});
	    },
	    rules:
        {
            "birth": {
				dateFormat : true
            },
            "imgfile":{
            	accept: "jpg|gif"
            }
        },
	    messages: {
	        "imgfile": {
				accept: "只能上傳JPG或GIF格式圖片"
		   	}
	    }
	});

	$("#txtBirth").datepicker({changeYear: true, changeMonth : true, dateFormat: 'yy-mm-dd', yearRange: "-45:+0"});
});
</script>
<div id="global">
	<?php require_once '/template/left-sidebar.phtml';?>
	<div id="content-with-twoside">
		<div class="global-border">
			<h1><span><?php echo $this->escape($this->title);?></span></h1>
			<div class="global-content">
				<form id="editUserInfoForm" method='post' action='<?php echo $this->escape($this->action);?>' enctype='multipart/form-data'>
					<table id="tblEditProfile">
						<tr>
					    	<td style="width: 80px;"><?php echo $this->escape($this->username);?></td>
					    	<td><label><?php echo $this->escape($this->usernameVal);?></label></td>
					    	<td rowspan="9" style="vertical-align: top; width: 135px;">
								<img src="<?php echo $this->escape($this->imageVal);?>" width="135px" height="135px"></img> 
							</td>
					  	</tr>
					  	<tr>
					    	<td><?php echo $this->escape($this->email);?></td>
					    	<td><label><?php echo $this->escape($this->emailVal);?></label></td>
					    </tr>
					    <tr>
					    	<td><?php echo $this->escape($this->phone);?></td>
					    	<td><label><?php echo $this->escape($this->phoneVal);?></label></td>
					    </tr>
					  	<tr>
					    	<td><?php echo $this->escape($this->gender);?></td>
					    	<td>
					    		<select name='gender'>
									<option value=''></option>
									<option value='M'<?php if($this->escape($this->genderVal)=='M'){echo ' selected';} ?>><?php echo $this->escape($this->male);?></option>
									<option value='F'<?php if($this->escape($this->genderVal)=='F'){echo ' selected';} ?>><?php echo $this->escape($this->female);?></option>
								</select>
							</td>
					  	</tr>
					  	<tr>
							<td><?php echo $this->escape($this->travel);?></td>
							<td>
								<select name="travel">
									<option value=""></option>
									<?php 
									for($i = 0;$i < sizeof($this->countryEntries); $i++){
									?>
									<option value="<?php echo $this->countryEntries[$i]->abbrev;?>" <?php if($this->countryEntries[$i]->abbrev == $this->travelVal){echo "selected";}?>>
									<?php echo $this->countryEntries[$i]->country_name;?></option>
									<?php 
									}
									?>
								</select>
							</td>
						</tr>
					  	<tr>
					    	<td><?php echo $this->escape($this->birth);?></td>
					    	<td><input type="text" name="birth" id='txtBirth' value="<?php echo $this->escape($this->birthVal);?>"></input></td>
					  	</tr>
					  	<tr>
							<td><?php echo $this->escape($this->image);?></td>
							<td><input type="file" name="imgfile"></td>
						</tr>
						<tr>
							<td><?php echo $this->escape($this->description);?></td>
							<td><textarea id='txtDescription' name='description' placeholder="只限40字" maxlength="40" rows="2" cols="30"><?php echo $this->escape($this->descriptionVal);?></textarea></td>
						</tr>
						<tr>
							<td colspan="2">
								<input type="submit" value="<?php echo $this->escape($this->change);?>"></input>
								<input type="button" id="cancel" value="<?php echo $this->escape($this->cancel);?>" onclick="window.location='<?php echo $this->escape($this->index);?>'"/>
							</td>
						</tr>
					</table>
					<input type="hidden" id="hidUser" value="<?php echo $this->escape($this->sessUser);?>"></input>
				</form>
			</div>
		</div>
	</div>
	<?php require_once '/template/right-sidebar.phtml';?>
</div>
